<template>
  <div>
    <canvas ref="canvas" @mousemove="mousemove" @click="click"></canvas>
  </div>
</template>

<script>
import helper from './js'

export default {
  data () {
    return {}
  },
  methods: {
    init (option) {
      this.graph = helper.init(this.$refs.canvas, option)
      return this.graph
    },
    addData (data) {
      if (this.graph) {
        this.graph.addData(data)
      }
    },
    getData () {
      if (this.graph) {
        return this.graph.getData()
      }
    },
    reloadData (data) {
      if (this.graph) {
        this.graph.reloadData(data)
      }
    },
    mousemove (event) {
      if (this.graph) {
        this.graph.mousemove(event)
      }
    },
    click (event) {
      if (this.graph) {
        this.graph.click(event)
      }
    }
  },
  mounted () {
    this.$emit('onload', this)
  },
  destroyed () {
    if (this.graph) {
      this.graph.dispose()
    }
  }
}
</script>
